<template>
	<view>
		<view class="toptext">
			<text class="text">{{title}}</text>
			<button style="margin-right: 0;" size="mini" @click="delect(list.dptid)">删除</button>
		</view>
		<view class="boximg">
			<text>部门Logo</text>
			<image :src="list.dptimg"></image>
		</view>
		<view class="boxtext">
			<text>部门名称</text>
			<input class="text" disabled="false" type="text" v-model="list.dptname">
		</view>
		<view class="boxtel">
			<text>部门负责人</text>
			<text class="text">{{dptemname}}</text>
			<select v-model="select">
				<option disabled value="">请选择</option>
				<option v-for="dept in options" :key="dept.empid" :value="dept.empid">{{dept.empname}}</option>
			</select>
		</view>
		<view class="boxbom">
			<text>部门人数</text>
			<input class="text" disabled="false" type="text" v-model="dptnum">
		</view>
		<view>
			<button @click="updata">保存</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'部门信息',
				dptimg:'',dptname:'',dptemid:'',dptemname:'',dptnum:'',select:'',
				options:[],list:'',
			}
		},
		onLoad(option) {
			var obj = JSON.parse(option.item)
			this.list = obj;
			this.dpid = obj.dptid
			this.getdata();
		},
		methods: {
			async getdata(){
				var emid = this.list.dptemid;
				const res = await this.Request({
					url:'/api/employee/getdptname',
					method:'POST',
					data:{departmentid:this.list.dptid}
				})
				this.options =res.data
				this.dptnum = res.data.length
				for(var i=0;i<res.data.length;i++){
					if(res.data[i].empid==emid){
						this.dptemname = res.data[i].empname
					}
				}
			},
			async updata(){
				var empid = this.select;
				if(empid!=''){
					const res = await this.Request({
						url:'/api/department/updptemid',
						method:'PUT',
						data:{dptemid:empid,dptid:this.dpid}
					})
					if(res){
						uni.showToast({
							title: '更新成功'
						})
						setTimeout(() => {
							uni.reLaunch({
								url:'/pages/super/sup-homepage/sup-homepage'
							})
						},1000)
					}
				}else{
					uni.showToast({
						title: '负责人为空',
						icon:'error'
					})
				}	
			},
			delect(e){
				uni.showModal({
					title: '提示',
					content: '是否确认删除此供应商',
					success(res) {
						if (res.confirm) {
							uni.request({
								url:'api/department/dptdelect',
								method:'DELETE',
								data:{dptid:e},
								success(respone){
									console.log(respone)
									setTimeout( () => {
										uni.showToast({
											title: '删除成功',
										})
									},300)
									uni.reLaunch({
										url:'/pages/super/superpage/dptment',
									})
								},
								fail(err){
									console.log(err)
								}
							})
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	text{
		font-family: 'Courier New';
		font-size: 130%;
		font-weight: 800;
		margin:auto 0;
		margin-left: 5px;
	}
	input{
		margin:auto 0;
	}
	.toptext{
		width: 100%;
		background-color: #efefef;
		display: flex;
		border-bottom: 1px solid #ccc;
		.text{
			margin: 5px 0 5px 5px;
			font-size: 110%;
			font-weight: 700;
			color: #d3d3d3;
		}
	}
	.boximg{
		height: 80px;
		width: 80px;
		display: flex;
		position: relative;
		image{
			position: absolute;
			margin: 5px 0 5px 140px;
			height: 70px;
			width: 70px;
			/* 背景图片置于最低层 */
			z-index: 3;
		}
	}
	.boxtext{
		height: 50px;
		display: flex;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		.text{
			margin-left: 70px;
			color: #d3d3d3;
		}
	}
	.boxtel{
		height: 50px;
		display: flex;
		border-bottom: 1px solid #ccc;
		select{
			margin:5px 0 5px 50px;
		}
		.text{
			margin-left: 55px;
			font-size: 110%;
			font-weight: 700;
			color: #d3d3d3;
			}
	}
	.boxbom{
		height: 50px;
		display: flex;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		.text{
			margin-left: 70px;
			color: #d3d3d3;
		}
	}
</style>
